{extend name="public/base" /}

{block name="title"}
	用户登录
{/block}

{block name="content"}
	<div class="content center-block animated fadeInDown">
		<div class="page-header h1">用户登录</div>
		<form id="form">
			<div class="form-group">
				<label for="username" class="control-label">用户名</label>
				<input type="text" class="form-control" id="username" name="username" placeholder="用户名" />
			</div>
			<div class="form-group">
				<label for="password" class="control-label">密码</label>
				<input type="password" class="form-control" id="password" name="password" placeholder="密码" />
			</div>
			<div class="form-group">
				<label for="verify" class="control-label">验证码</label>
				<div class="input-group">
					<input type="text" class="form-control" id="verify" name="verify" placeholder="验证码" />
					<span class="input-group-addon">
						<img src="{:captcha_src()}" alt="验证码" onclick="this.src='{:captcha_src()}?id=5'" />
					</span>
				</div>
			</div>
			<div class="form-group">
				<button class="btn btn-primary btn-block" id="login">登录</button>
			</div>
		</form>
	</div>
{/block}

{block name="copyright"}
{/block}

{block name="js"}
<script>
	// 用户登录
	$("#login").click(function () {
		$.ajax({
			url: "",
			type: "post",
			data: $("#form").serialize(),
			dataType: 'json',
			success: function (data) {
				if (data.code == 1){
					layer.msg("登录成功", {
						icon: 6,
						time: 500
					}, function () {
						location.href = data.url;
					});
				}else {
					layer.open({
						title: '登录失败',
						content: data.msg,
						icon: 5,
						anim: 6
					});
				}
			}
		});

		return false;
	});
</script>

{/block}
